<!DOCTYPE html>{#

    run server/expand.js to instantiate this template
    -------------------------------------------------
#}
<html itemscope itemtype="http://schema.org/Map" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
<head>
    <meta charset="utf-8"/>
    <title>earth :: an animated map of global wind and weather</title>
    <meta itemprop="name"                                      content="{{__('earth')}}"/>
    <meta itemprop="description"     name="description"        content="{{__('an animated map of global wind and weather')}}"/>
    <meta itemprop="author"          name="author"             content="Cameron Beccario"/>

    <meta property="og:type"        content="website"/>
    <meta property="og:title"       content="{{__('earth')}}"/>
    <meta property="og:description" content="{{__('An animated map of global wind and weather. Visit the community at https://www.facebook.com/EarthWindMap')}}"/>
    <meta property="og:url"         content="http://earth.nullschool.net"/>
    <meta property="og:image"       content="http://earth.nullschool.net/preview.jpg"/>

    <link rel="shortcut icon" href="/favicon.ico"/>
    <link rel="apple-touch-icon" sizes="120x120" href="/iphone-icon.png"/>
    <link rel="apple-touch-icon" sizes="152x152" href="/ipad-icon.png"/>
    <link rel="stylesheet" type="text/css" href="/styles/styles.css"/>

    <link rel="alternate" hreflang="x-default" href="http://earth.nullschool.net/"/>
    <link rel="alternate" hreflang="ja" href="http://earth.nullschool.net/jp/"/>
</head>
<body data-lang="{{__('lang')}}">

    <!--[if lte IE 8]><p id="warn">{{__('This site requires IE9 or newer.')}}</p><![endif]-->

    <div id="display">
        <svg id="map" class="fill-screen" xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>
        <canvas id="animation" class="fill-screen"></canvas>
        <canvas id="overlay" class="fill-screen"></canvas>
        <svg id="foreground" class="fill-screen" xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>
    </div>

    <div id="sponsor" class="invisible">
        <p><span id="sponsor-hide" class="text-button invisible"> ✕ </span>{{__('community')}}</p>
        <a id="sponsor-link" href="https://www.facebook.com/EarthWindMap">EarthWindMap</a>
    </div>

    <div id="details">
        <p id="status"></p>
        <div id="location">
            <p>
                <span id="location-coord"></span>
                <span id="location-close" class="invisible text-button"> ✕ </span>
            </p>
            <p>
                <span id="location-wind"></span>
                <span id="location-wind-units" class="text-button"></span>
            </p>
            <p>
                <span id="location-value"></span>
                <span id="location-value-units" class="text-button"></span>
            </p>
        </div>

        <p id="earth">
            <span id="show-menu" class="text-button" title="menu">{{__('earth')}}</span>
            <span id="progress" class="invisible"></span>
        </p>

        <div id="menu" class="invisible">
            <p>{{__('Date')}} | <span
                id="data-date" class="local"></span> <span
                id="toggle-zone" class="text-button"></span>
            </p>
            <p>{{__('Data')}} | <span id="data-layer"></span></p>
            <p><span id="scale-label">{{__('Scale')}} | </span><canvas id="scale"></canvas></p>
            <p>{{__('DataSource')}} | <span id="data-center"></span></p>
            <p>{{__('Control')}} | <span
                class="text-button" id="nav-now" title="{{__('Current Conditions')}}">{{__('Now')}}</span><span
                class="text-button" id="nav-backward-more"> « </span> – <span
                class="text-button" id="nav-backward"> ‹ </span> – <span
                class="text-button" id="nav-forward"> › </span> – <span
                class="text-button" id="nav-forward-more"> » </span><span
                class="text-button" id="show-location" title="{{__('Current Position')}}">〖◯〗</span><span
                class="text-button" id="option-show-grid" title="{{__('Toggle Grid')}}">{{__('Grid')}}</span>
            </p>
            <p>{{__('Mode')}} | <span
                class="text-button" id="wind-mode-enable">{{__('Air')}}</span> – <span
                class="text-button" id="ocean-mode-enable">{{__('Ocean')}}</span>
            </p>
            <p class="wind-mode">{{__('Height')}} | <span
                class="surface text-button" id="surface-level" title="{{__('Surface')}}">{{__('Sfc')}}</span> – <span
                class="surface text-button" id="isobaric-1000hPa">1000</span> – <span
                class="surface text-button" id="isobaric-850hPa">850</span> – <span
                class="surface text-button" id="isobaric-700hPa">700</span> – <span
                class="surface text-button" id="isobaric-500hPa">500</span> – <span
                class="surface text-button" id="isobaric-250hPa">250</span> – <span
                class="surface text-button" id="isobaric-70hPa">70</span> – <span
                class="surface text-button" id="isobaric-10hPa">10</span> hPa
            </p>
            <p class="wind-mode">{{__('Overlay')}} | <span
                class="text-button" id="overlay-off">{{__('None')}}</span> – <span
                class="text-button" id="overlay-wind" title="{{__('Wind Speed')}}">{{__('Wind')}}</span> – <span
                class="text-button" id="overlay-temp" title="{{__('Temperature')}}">{{__('Temp')}}</span> – <span
                class="text-button" id="overlay-relative_humidity" title="{{__('Relative Humidity')}}">{{__('RH')}}</span> – <span
                class="text-button" id="overlay-air_density" title="{{__('Air Density')}}">{{__('AD')}}</span> – <span
                class="text-button" id="overlay-wind_power_density" title="{{__('Wind Power Density')}}">{{__('WPD')}}</span>
            </p>
            <p class="wind-mode"><span style="visibility:hidden">{{__('Overlay')}}</span> | <span
                class="text-button" id="overlay-total_precipitable_water" title="{{__('Total Precipitable Water')}}">{{__('TPW')}}</span> – <span
                class="text-button" id="overlay-total_cloud_water" title="{{__('Total Cloud Water')}}">{{__('TCW')}}</span> – <span
                class="text-button" id="overlay-mean_sea_level_pressure" title="{{__('Mean Sea Level Pressure')}}">{{__('MSLP')}}</span>
            </p>
            <p class="ocean-mode invisible">{{__('Animate')}} | <span
                class="text-button" id="animate-currents" title="{{__('Currents')}}">{{__('Currents')}}</span>
            </p>
            <p class="ocean-mode invisible">{{__('Overlay')}} | <span
                class="text-button" id="overlay-ocean-off">{{__('None')}}</span> – <span
                class="text-button" id="overlay-currents" title="{{__('Currents')}}">{{__('Currents')}}</span>
            </p>
            <p class="ocean-mode invisible"><span style="visibility:hidden">{{__('Overlay')}}</span> |</p>
            <p>{{__('Projection')}} | <span
                class="proj text-button" id="atlantis" title="{{__('Atlantis')}}">A</span> – <span
                class="proj text-button" id="azimuthal_equidistant" title="{{__('Azimuthal Equidistant')}}">AE</span> – <span
                class="proj text-button" id="conic_equidistant" title="{{__('Conic Equidistant')}}">CE</span> – <span
                class="proj text-button" id="equirectangular" title="{{__('Equirectangular')}}">E</span> – <span
                class="proj text-button" id="orthographic" title="{{__('Orthographic')}}">O</span> – <span
                class="proj text-button" id="stereographic" title="{{__('Stereographic')}}">S</span> – <span
                class="proj text-button" id="waterman" title="{{__('Waterman Butterfly')}}">WB</span> – <span
                class="proj text-button" id="winkel3" title="{{__('Winkel Tripel')}}">W3</span>
            </p>
            <!--<p>免責事項 | 正確な情報を提供するためのものではありません</p>-->
            <p id="lang"><a href="{{__('/jp')}}" class="internal-link">{{__('日本語')}}</a></p>
            <p>
                <a href="about.html" class="internal-link">{{__('about')}}</a>
                <a href="https://www.facebook.com/EarthWindMap" class="social-icon" title="Facebook">&#xe027;</a>
                <a href="https://twitter.com/cambecc" class="social-icon" title="Twitter">&#xe086;</a>
            </p>
        </div>
    </div>

    <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js" charset="utf-8"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js" charset="utf-8"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/topojson/1.1.0/topojson.min.js" charset="utf-8"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.3.10/d3.min.js" charset="utf-8"></script>

<!--
    <script src="/libs/underscore.js/1.6.0/underscore.js" charset="utf-8"></script>
    <script src="/libs/backbone.js/1.1.0/backbone.js" charset="utf-8"></script>
    <script src="/libs/topojson/1.1.0/topojson.js" charset="utf-8"></script>
    <script src="/libs/d3/3.3.10/d3.js" charset="utf-8"></script>
-->

    <script src="/libs/d3.geo/0.0.0/d3.geo.projection.v0.min.js" charset="utf-8"></script>
    <script src="/libs/d3.geo/0.0.0/d3.geo.polyhedron.v0.min.js" charset="utf-8"></script>
    <script src="/libs/when/2.6.0/when.js" charset="utf-8"></script>

    <script src="/libs/earth/1.0.0/micro.js" charset="utf-8"></script>
    <script src="/libs/earth/1.0.0/globes.js" charset="utf-8"></script>
    <script src="/libs/earth/1.0.0/products.js" charset="utf-8"></script>
    <script src="/libs/earth/1.0.0/earth.js" charset="utf-8"></script>

</body>
</html>
